/* finesse · product · PIKA yellow/neutral · split conversation/canvas · CSS feedback · jewelry artifacts */
.ds-shell{--ds-bg:#fff;--ds-page:#f5f5f2;--ds-line:rgba(32,40,32,.13);--ds-ink:#202620;--ds-muted:#62695f;--ds-gold:#f6cb19;--ds-soft:#fff9df;--ds-shadow:0 8px 24px rgba(30,38,28,.05);--ds-danger:#ad342c;--ds-radius:18px;height:100dvh;min-height:0;padding:0 24px 22px;display:grid;grid-template-rows:66px 56px minmax(0,1fr);color:var(--ds-ink);background:var(--ds-page);font-size:14px;overflow:hidden}
.ds-shell button:not(:where(.generation-result-heading *, .generation-result-actions *, .generation-sketch-image)){display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:8px 12px;background:var(--ds-bg);border:1px solid var(--ds-line);border-radius:10px;font-size:14px;line-height:1.2;color:var(--ds-ink);white-space:nowrap;box-shadow:none;transform:none;transition:background .15s ease}
.ds-shell button:not(:where(.generation-result-heading *, .generation-result-actions *, .generation-sketch-image)):hover{background:var(--ds-page);transform:none;box-shadow:none}.ds-shell button:not(:where(.generation-result-heading *, .generation-result-actions *, .generation-sketch-image)):active{transform:none}.ds-shell button:not(:where(.generation-result-heading *, .generation-result-actions *, .generation-sketch-image)):disabled{opacity:.45;cursor:not-allowed}.ds-shell button:not(:where(.generation-result-heading *, .generation-result-actions *, .generation-sketch-image)):focus-visible,.ds-shell a:focus-visible{outline:2px solid var(--ds-muted);outline-offset:3px}.ds-shell button:not(:where(.generation-result-heading *, .generation-result-actions *, .generation-sketch-image)) svg{width:17px;height:17px;flex-shrink:0}
.ds-shell small{font-size:12px;color:var(--ds-muted)}.ds-header{display:flex;align-items:center;gap:12px;min-width:0}.ds-header .mp-breadcrumb{flex:1;min-width:0;overflow:hidden;margin:0}
.ds-body{--ds-gutter:16px;--ds-chat-default:340px;min-height:0;min-width:0;display:grid;grid-template-columns:minmax(0,min(var(--ds-chat-width,var(--ds-chat-default)),max(0px,calc(100% - var(--ds-gutter) - 320px)))) var(--ds-gutter) minmax(0,1fr)}.ds-chat{min-width:0;min-height:0;border:1px solid var(--ds-line);border-radius:var(--ds-radius);overflow:hidden;background:var(--ds-bg);box-shadow:var(--ds-shadow)}.ds-chat{display:grid;grid-template-rows:minmax(0,1fr) auto}.ds-chat-scroll{padding:25px 22px;overflow-y:auto;overscroll-behavior:contain}.ds-service-note{font-size:12px;color:var(--ds-muted);padding:12px;background:var(--ds-page);border-radius:9px;line-height:1.7;margin:0 0 20px}.ds-confirm-card{padding:17px;border:1px solid var(--ds-line);border-radius:12px;margin-bottom:18px}.ds-confirm-card>span{font-size:12px;color:var(--ds-muted)}.ds-confirm-card h3{font-size:17px;margin:12px 0}.ds-confirm-card p{white-space:pre-wrap;font-size:14px;line-height:1.9;margin-bottom:18px}.ds-confirm-card>div{display:flex;gap:8px;flex-wrap:wrap}.ds-message{margin:24px 0;font-size:14px;line-height:1.8}.ds-message p{white-space:pre-wrap;overflow-wrap:anywhere}.ds-loading{padding:50px;font-size:16px}
@media(min-width:1500px){.ds-shell{padding-left:30px;padding-right:30px}.ds-body{--ds-gutter:20px}}
@media(max-width:1100px){.ds-shell{padding:0 16px 16px}.ds-body{--ds-chat-default:max(290px,32%);--ds-gutter:12px}}
@media(max-width:760px){.ds-shell{height:100dvh;padding:0 10px 12px;grid-template-rows:56px 50px 48px minmax(0,1fr)}.ds-header{gap:5px}.ds-header .mp-breadcrumb{font-size:12px}.ds-body{display:block;position:relative}.ds-chat{height:100%}.show-canvas>.ds-chat{display:none}.ds-chat-scroll{padding:20px}}
.ds-body:has(>.ds-resize[data-resizing=true]){cursor:col-resize;user-select:none}
.ds-shell .design-inspiration-trigger{bottom:92px;right:44px;background:var(--ds-gold);border-color:var(--ds-gold)}.ds-header .mp-breadcrumb{display:flex;align-items:center;gap:10px;white-space:nowrap;font-size:13px;color:var(--ds-muted)}.ds-header .mp-breadcrumb a{color:inherit;text-decoration:none}.ds-header .mp-breadcrumb [aria-current=page]{color:var(--ds-ink)}
.ds-inspiration-tabs{display:flex;align-items:center;gap:16px;padding:0 24px 18px}/* React Flow supplies inline position/height; keep its viewport inside the toolbar rails. */
@media(prefers-reduced-motion:reduce){.ds-shell *{transition:none!important;scroll-behavior:auto!important}}